<template>
  <div class="page">
    <div class="layui-fluid">
      <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
          <div class="layui-card">
            <div class="layui-card-body cardbody">
              <div class="layui-form" lay-filter="djlist">
                <div class="layui-form-item">
                  <div class="layui-inline">
                    <label class="layui-form-label">等级名称</label>
                    <div class="layui-input-inline">
                      <input
                        type="text"
                        name="name"
                        placeholder="请输入等级名称"
                        v-model="itemData.name"
                        autocomplete="off"
                        class="layui-input"
                      />
                    </div>
                  </div>
                </div>

                <div class="layui-form-item">
                  <label class="layui-form-label">会员等级</label>
                  <div class="layui-input-inline">
                    <select
                      name="memberGrade"
                      lay-filter="memberGrade"
                      v-model="itemData.memberGrade"
                    >
                      <option value="ZERO">非会员</option>
                      <option value="ONE">1级</option>
                      <option value="TWO">2级</option>
                      <option value="THREE">3级</option>
                      <option value="FOUR">4级</option>
                      <option value="FIVE">5级</option>
                      <option value="SIX">6级</option>
                      <option value="SEVEN">7级</option>
                      <option value="EIGHT">8级</option>
                      <option value="NINE">9级</option>
                      <option value="TEN">10级</option>
                      <option value="ELEVEN">11级</option>
                      <option value="TWELVE">12级</option>
                      <option value="THIRTEEN">13级</option>
                      <option value="FOURTEEN">14级</option>
                      <option value="FIFTEEN">15级</option>
                    </select>
                  </div>
                </div>

                <div class="layui-form-item">
                  <div class="layui-inline">
                    <label class="layui-form-label">会员价格</label>
                    <div class="layui-input-inline">
                      <input
                        type="number"
                        name="price"
                        placeholder="请输入价格,单位(元)"
                        autocomplete="off"
                        v-model="itemData.price"
                        class="layui-input"
                      />
                    </div>
                  </div>
                </div>

                <div class="layui-form-item">
                  <div class="layui-inline">
                    <label class="layui-form-label">折扣</label>
                    <div class="layui-input-inline">
                      <input
                        type="number"
                        name="discount"
                        placeholder="75表示7.5折"
                        autocomplete="off"
                        v-model="itemData.discount"
                        class="layui-input"
                      />
                    </div>
                  </div>
                </div>

                <div class="layui-form-item">
                  <div class="layui-input-block">
                    <button class="layui-btn  layui-btn-normal" @click="sure">
                      确认
                    </button>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "meadd",
  data() {
    return {
      id: "",
      itemData: {
        name: "", //等级名称
        memberGrade: "", //会员等级
        price: "", //会员价格
        discount: "" //折扣
      },
      type: localStorage.getItem("type")
    };
  },
  mounted() {
    var _this = this;
    window.getdates = this.getdates;
  },
  methods: {
    sure: function(data) {
      var _this = this;

      if (_this.itemData.price < 0) {
        layer.msg("请输入价格不能小于0");
        return false;
      }
      if (_this.itemData.discount < 0) {
        layer.msg("请输入折扣不能小于0");
        return false;
      }

      var dates = {
        name: _this.itemData.name,
        memberGrade: _this.itemData.memberGrade,
        price: _this.itemData.price * 100,
        discount: _this.itemData.discount
      };

      // dates.id = data.id;
      //   alert(JSON.stringify(dates));
      var url = "/shop/aapi/v1.9/levels";

      ajaxRequest(url, "POST", "json", dates, function(ret, err) {
        layer.msg("操作成功");
        setTimeout(function() {
          var index = parent.layer.getFrameIndex(window.name);
          parent.layer.close(index);
          parent.location.reload();
        }, 1000);
      });
    }
  },
  updated: function() {
    var _this = this;
    layui.use("form", function() {
      var form = layui.form;
      form.render();
      form.render(null,'djlist');
      form.on("select(memberGrade)", function(data) {
        _this.itemData.memberGrade = data.value;
      });
    });
  }
};
</script>
<style scoped></style>
